<script setup>
import { getStudentsInfo } from "@/api/list";
defineProps({
  msg: String,
});

const count = ref(0);
const listStudents = ref([]);

onMounted(() => {
  getStudentsInfo().then((res) => {
    listStudents.value = res;
  });
});
</script>

<template>
  <h1>{{ msg }}</h1>

  <div class="card">
    <button type="button" @click="count++">count is {{ count }}</button>
  </div>

  <ul>
    <li v-for="item in listStudents">
      <span>{{ item.name }}</span>
    </li>
  </ul>
</template>

<style scoped>
.read-the-docs {
  color: #888;
}
</style>
